 <template>
  <div>
    <template v-for="(menu, idx) in data">
      <!-- el-submenu 标签的 index值只能是  字符串的  idx -->
      <el-submenu :index="idx + ''" v-if="menu.children && menu.children.length > 0" :key="idx">
        <template slot="title">
          <i class="el-icon-menu" style="color: #fff"></i>
          <span slot="title">{{ menu.name }}</span>
        </template>
        <custom-menu-tree :data="menu.children"></custom-menu-tree>
      </el-submenu>
      <el-menu-item v-else :index="menu.url" :key="idx">
        <i class="el-icon-menu" style="color: #fff"></i>
        <span slot="title">{{ menu.name }}</span>
      </el-menu-item>
    </template>
  </div>
</template>
<script>
import CustomMenuTree from "@/components/CustomMenuTree";
export default {
  name: "CustomMenuTree",
  components: {
    CustomMenuTree,
  },
  data() {
    return {
      menu_data: {},
    };
  },
  props: ["data"],
};
</script>